<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

    <!--用户意见-->
    <!--用户意见-->
    <!--用户意见-->
    <!--用户意见-->


</head>
<body>
<div id="app">
    <el-form  :inline="true"  class="demo-form-inline">
        <el-form-item label="相关内容">
            <el-input v-model="search.content" placeholder="请输入相关内容"></el-input>
        </el-form-item>
        <el-form-item>
            <el-button  type="primary" @click="onSubmit()">搜索</el-button>
        </el-form-item>
    </el-form>

    <template>
        <el-table
                :data="opinionArr"
                border
                style="width: 100%">
            <el-table-column
                    prop="id"
                    label="编号"
                    width="170">
            </el-table-column>
            <el-table-column
                    prop="telephone"
                    label="电话"
                    width="270">
            </el-table-column>
            <el-table-column
                    prop="content"
                    label="内容">
            </el-table-column>
            <el-table-column label="操作" width="150">
                <template slot-scope="scope">
                    <el-button type="danger" @click="under(scope.row.id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </template>
</div>

<script>



    var haha = new Vue({
        el:"#app",
        data:{
            search:{},
            opinionArr:[]
        },
        methods:{
            //删除按钮
            under(id){
                haha.$confirm('此操作将永久删除该建议, 是否继续?', '温馨提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    $.get("/ssm/opinion/delete/"+id,function (backData) {
                        haha.$message({
                            type: 'success',
                            message: '删除成功!' });
                        getData(1,10);
                    })
                });
            },
            onSubmit(){
                getData(1,10);
            }
        }
    });
    function getData(a , b) {
        haha.search.pageNo = a;
        haha.search.pageCount = b;
        //获取全部用户意见，展示到表格中

        $.post("/ssm/opinion/opinions",haha.search,function (backData) {
            haha.opinionArr = backData.data.currentData;
            haha.totalCount = backData.data.totalCount;
        });
    }
    getData(1,10)
</script>
</body>
</html>